<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html><head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <title>My JSP 'index.jsp' starting page</title>
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	<!--
	<link rel="stylesheet" type="text/css" href="styles.css">
	-->
	
	<script type="text/javascript" src="toUpload_upload_data/jquery-1.js"></script>
	 <style type="text/css"> 
	 	iframe{  
            border:none;  
            width:0;  
            height:0;  
        }  
	 	#progress{
	 		display:none;	
	 	} 
        #p_out{  
          width:300px;  
          height:12px;  
          margin:10px 0 0 0;  
          padding:1px;  
          font-size:10px;  
          border:solid #6b8e23 1px;  
        }  
        #p_in{  
          width:0%;  
          height:100%;  
          background-color:#6b8e23;  
          margin:0;  
          padding:0;  
        }  
        #dis{  
          margin:0;  
          padding:0;  
          text-align:center;  
          font-size:12px;  
          height:12px;  
          width:300px;  
        }  
</style>
	<script type="text/javascript">
		 var inter = null;
	     function formSubmit(){  
	     	var fileName = $("#fileName").val();
	    	var index1=fileName.lastIndexOf(".");  
			var index2=fileName.length;
			var postf=fileName.substring(index1+1,index2);//后缀名  
			if(postf==""){
				alert("请选择要上传的文件");
				return;
			}
	     	$("#progress").show();
	        inter = window.setInterval("callback();", 100);//每隔100毫秒执行callback  
			document.getElementById('dis').innerHTML = "初始化数据...";  
	        document.getElementById('p_in').style.width = "0%";
	        document.form.submit();
	     }    
		 function callback(){  
	        $.ajax({
			    url: "getStatus_upload",
			    type: "POST",
			    async:false,
			    data: {
			    },  
			    error:function(errorMsg){
			    },
			    success: function(data){
					document.getElementById('dis').innerHTML = '已上传：'+data;  
			        document.getElementById('p_in').style.width = data;  
	    			if(data.indexOf("100%")!=-1){
	    				uploadSuccess();
	    			}
			    }
			});
	    }  
	    function uploadSuccess(){
	    	clearInterval(inter);
	    	document.getElementById('p_in').style.width = "100%";
			document.getElementById('dis').innerHTML = "上传服务器成功,正在写入数据库,请稍后...!";  
	    }
	    function change(){
	    	document.getElementById('dis').innerHTML = "写入数据库成功!";
	    	alert("保存数据成功！");
	    	window.location.reload()	;
	    }
	</script>
	
  </head>
  
  <body>
  	<form action="http://172.100.0.20:80//upload_upload" method="post" enctype="multipart/form-data" target="progress_iframe" name="form">  
        <input id="fileName" name="file" type="file">&nbsp;&nbsp;<input onclick="formSubmit();" value="提交" type="button">  
    </form>  
    <iframe id="progress_iframe" name="progress_iframe" src="javascript:void(0)" frameborder="0"></iframe>  
	<div id="progress">
	    <div id="p_out"><div id="p_in">
	    </div></div>  
	    <div id="dis"></div>
    </div>
  

</body></html>